<template>
  <div v-loading="loading" class="addExpense">
    <el-form ref="form" :model="form" :rules="roleCodeRule" label-width="120px">
      <el-row>
        <mainTilte title="基本信息" />
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="商品主图" prop="image_url">
            <upload-file accept-type="image/jpeg,image/png" list-type="picture-card" :file-list="imageList" :upload-limit="1" @handleImageSuccess="handleImageSuccess" @beforeRemoveFile="beforeImageUpload" />
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-col :span="8">
            <el-form-item label="商品分类" prop="category_id">
              <product-category v-model="form.category_id" :disabled="!!queryId" @change="handleChangeClassify" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="系统sku" prop="code">
              <el-input v-model.trim="form.code" oninput="value=value.replace(/[\u4E00-\u9FA5]/g,'')" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="中文名称" prop="name_ch">
              <el-input v-model.trim="form.name_ch" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="英文名称" prop="name_en">
              <el-input v-model="form.name_en" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="运营类型" prop="operate_type">
              <el-select v-model.trim="form.operate_type" disabled clearable placeholder="运营类型">
                <el-option v-for="(item, index) of operateList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="UPC条码" prop="bar_code_upc">
              <el-input v-model.trim="form.bar_code_upc" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="产品条码1" prop="bar_code">
              <el-input v-model.trim="form.bar_code" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="产品条码2" prop="bar_code2">
              <el-input v-model.trim="form.bar_code2" />
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
          <el-form-item label="所属供应商" prop="supplier_id">
            <app-select v-model="form.supplier_id" url="/supply" :params="supplyParams" options-label="name" placeholder="请选择供应商" options-value="id" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="采购员" prop="purchase_id">
            <app-select v-model="form.purchase_id" url="/shops/buyers" :params="purchaseParams" options-label="username" options-value="user_id" placeholder="请选择采购员" :disabled="isAudited" @change="changePurchaseHandler" />
          </el-form-item>
        </el-col> -->
          <el-col :span="8">
            <el-form-item label="所属客户" prop="company_id">
              <el-input v-model.trim="form.company_name" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="申报单价(USD)" prop="purchase_price_usd">
              <el-input-number v-model.trim="form.purchase_price_usd" :controls="false" :min="0" :max="9999999999" :precision="2" class="wfull tal" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="保险价值(USD)" prop="insured_price_usd">
              <el-input-number v-model.trim="form.insured_price_usd" :controls="false" :min="0" :max="9999999999" :precision="2" class="wfull tal" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="包装方式" prop="packing_method">
              <el-select v-model.trim="form.packing_method" :disabled="!!queryId" clearable placeholder="包装方式">
                <el-option v-for="(item, index) of splitOrderList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否保价" prop="insured_price">
              <el-select v-model.trim="form.insured_price" clearable placeholder="是否保价">
                <el-option v-for="(item, index) of isSurePriceList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col v-if="form.insured_price == 1 && form.packing_method == 1" :span="8">
            <el-form-item label="保值(USD)" prop="hedge_price">
              <el-input-number v-model.trim="form.hedge_price" :controls="false" :min="0" :max="9999999999" :precision="2" class="wfull tal" />
            </el-form-item>
          </el-col>
          <el-col v-if="form.packing_method == 1" :span="8">
            <el-form-item label="可合并发货数量" prop="merge_num">
              <el-input v-model.trim="form.merge_num" :disabled="isAudited" />
            </el-form-item>
          </el-col>
        </el-col>

      </el-row>
      <el-row>
        <mainTilte title="产品信息" />
      </el-row>
      <el-row v-if="form.otherDataJson">
        <el-col :span="6">
          <el-form-item label="尺寸" prop="otherDataJson[0].size">
            <el-input v-model="form.otherDataJson[0].size" :min="0" :max="9999999999" type="textarea" autosize />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="重量" prop="otherDataJson[0].weight">
            <el-input v-model="form.otherDataJson[0].weight" :min="0" :max="9999999999" type="textarea" autosize />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="颜色" prop="otherDataJson[0].color">
            <el-input v-model="form.otherDataJson[0].color" type="textarea" autosize />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="材质" prop="otherDataJson[0].material">
            <el-input v-model="form.otherDataJson[0].material" type="textarea" autosize />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="用途" prop="otherDataJson[0].purpose">
            <el-input v-model="form.otherDataJson[0].purpose" type="textarea" autosize />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="其他备注" prop="otherDataJson[0].other_remark">
            <el-input v-model="form.otherDataJson[0].other_remark" type="textarea" autosize />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <mainTilte title="关税信息" />
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="国内(HS)" prop="ZH_HS">
            <el-input v-model.trim="form.ZH_HS" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="国外(HS)" prop="EN_HS">
            <el-input v-model.trim="form.EN_HS" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="国内退税率">
            <el-input v-model.trim="form.tax_rebate_rate" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="国外关税税率">
            <el-input v-model.trim="form.tax_tariff_rate" disabled />
          </el-form-item>
        </el-col>
      </el-row>
      <div v-if="form.packing_method == 2">
        <el-row>
          <mainTilte title="商品分组信息" />
        </el-row>
        <el-row v-if="!isAudited" style="margin-bottom: 15px">
          <el-button type="success" icon="el-icon-circle-plus-outline" @click="addGroup">添加分组</el-button>
          <el-button type="danger" @click="deleteGroup">批量删除</el-button>
        </el-row>
        <el-row class="mb24">
          <el-table ref="multipleTable" :data="form.groupDataJson" stripe fit border @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="操作" width="65" align="center">
              <template slot-scope="scope">
                <span v-if="!isAudited" style="color: #ff4444; font-size: 14px; cursor: pointer" @click="handleDelete(scope.$index, scope.row)">删除</span>
              </template>
            </el-table-column>
            <el-table-column prop="name" label="名称" width="250" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.name'" class="no-label" :rules="nameRule">
                  <el-input v-model="scope.row.name" placeholder="请输入名称" />
                </el-form-item>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="number" label="数量" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.number'" class="no-label" :rules="numberRule">
                  <el-input v-model="scope.row.number" placeholder="请输入数量" />
                </el-form-item>
              </template>
            </el-table-column> -->
            <el-table-column prop="length" label="尺寸公制(长)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.length'" class="no-label" :rules="lengthRule">
                  <el-input v-model="scope.row.length" placeholder="请输入尺寸公制(长)" maxlength="10" @change="sizeChange($event, scope.$index, 'length_AS')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="width" label="尺寸公制(宽)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.width'" class="no-label" :rules="widthRule">
                  <el-input v-model="scope.row.width" placeholder="请输入尺寸公制(宽)" @change="sizeChange($event, scope.$index, 'width_AS')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="height" label="尺寸公制(高)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.height'" class="no-label" :rules="heightRule">
                  <el-input v-model="scope.row.height" placeholder="请输入尺寸公制(高)" maxlength="10" @change="sizeChange($event, scope.$index, 'height_AS')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="volume" label="体积(公制)" width="180" align="center">
              <template slot-scope="scope">
                <p>
                  {{ getVolume(scope.row.length, scope.row.width, scope.row.height) }}
                </p>
              </template>
            </el-table-column>
            <el-table-column prop="length_AS" label="尺寸美制(长)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="length_AS" class="no-label">
                  <el-input v-model="scope.row.length_AS" placeholder="请输入尺寸美制(长)" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="width_AS" label="尺寸美制(宽)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="width_AS" class="no-label">
                  <el-input v-model="scope.row.width_AS" placeholder="请输入尺寸美制(宽)" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="height_AS" label="尺寸美制(高)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="height_AS" class="no-label">
                  <el-input v-model="scope.row.height_AS" placeholder="请输入尺寸美制(高)" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="volume_AS" label="体积(美制)" width="180" align="center">
              <template slot-scope="scope">
                <p>
                  {{ getVolume(scope.row.length_AS, scope.row.width_AS, scope.row.height_AS) }}
                </p>
              </template>
            </el-table-column> -->
            <el-table-column prop="volume_weight_AS" label="体积重(美制)" width="180" align="center">
              <template slot-scope="scope">
                <!-- <p>{{ scope.row.volume_weight_AS }}</p> -->
                <p>
                  {{ getVolumeWeight(scope.row.length_AS, scope.row.width_AS, scope.row.height_AS) }}
                </p>
              </template>
            </el-table-column>
            <el-table-column prop="weight_gross" label="毛重(公制)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="weight_gross" class="no-label" :rule="weightProssASRule">
                  <el-input v-model="scope.row.weight_gross" placeholder="请输入毛重(公制)" @input="weightChange($event, scope.$index, 'weight_gross_AS')" />
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column prop="weight_gross_AS" label="毛重(美制)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="weight_gross_AS" class="no-label">
                  <el-input v-model="scope.row.weight_gross_AS" placeholder="请输入毛重(美制)" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="weight" label="净重(公制)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="weight" class="no-label">
                  <el-input v-model="scope.row.weight" placeholder="请输入净重(公制)" @input="weightChange($event, scope.$index, 'weight_AS')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="weight_AS" label="净重(美制)" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item prop="weight_AS" class="no-label">
                  <el-input v-model="scope.row.weight_AS" placeholder="请输入净重(美制)" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="oversize" label="Oversize" width="180" align="center">
              <template slot-scope="scope">
                <!-- <p>{{ scope.row.oversize }}</p> -->
                <p>
                  {{ getOversize(scope.row.length_AS, scope.row.width_AS, scope.row.height_AS) }}
                </p>
              </template>
            </el-table-column>
            <el-table-column v-if="form.insured_price == 1" prop="hedge_price" label="保值" width="180" align="center">
              <template slot-scope="scope">
                <el-form-item :prop="'groupDataJson.' + scope.$index + '.hedge_price'" :rules="hedgePriceRule" class="no-label">
                  <el-input-number v-model.trim="scope.row.hedge_price" :controls="false" :min="0" :max="9999999999" :precision="2" class="wfull tal" />
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
      </div>
      <template v-if="form.packing_method !== 2">
        <el-row>
          <mainTilte title="包装信息" />
        </el-row>
        <el-row v-if="form.packDataJson && form.packing_method !== 2">
          <el-col :span="8">
            <el-form-item label="尺寸(公制)">
              <div class="sizeStyle">
                <div>
                  <el-form-item class="no-label" prop="packDataJson[0].length">
                    <el-input v-model="form.packDataJson[0].length" placeholder="长">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
                <div style="margin-left: 8px">
                  <el-form-item class="no-label" prop="packDataJson[0].width">
                    <el-input v-model="form.packDataJson[0].width" placeholder="宽">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
                <div style="margin-left: 8px">
                  <el-form-item class="no-label" prop="packDataJson[0].height">
                    <el-input v-model="form.packDataJson[0].height" placeholder="高">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="体积(公制)">
              <el-input v-model.trim="dataCal.volume" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="尺寸(美制)">
              <div class="sizeStyle">
                <div>
                  <el-input v-model="dataCal.length_AS" placeholder="长" disabled>
                    <template slot="append">IN</template>
                  </el-input>
                </div>
                <div style="margin-left: 8px">
                  <el-input v-model="dataCal.width_AS" placeholder="宽" disabled>
                    <template slot="append">IN</template>
                  </el-input>
                </div>
                <div style="margin-left: 8px">
                  <el-input v-model="dataCal.height_AS" placeholder="高" disabled>
                    <template slot="append">IN</template>
                  </el-input>
                </div>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <!-- <el-form-item label="体积(美制)">
            <el-input v-model.trim="dataCal.volume_AS" disabled />
          </el-form-item> -->
          </el-col>
          <el-col :span="8">
            <el-form-item label="体积重(美制)">
              <el-input v-model.trim="dataCal.volume_weight_AS" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="Oversize参数">
              <el-input v-model.trim="dataCal.oversize" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="毛重(公制)" prop="packDataJson[0].weight_gross">
              <el-input v-model="form.packDataJson[0].weight_gross" placeholder="请输入内容">
                <template slot="append">kg</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="毛重(美制)" disabled>
              <el-input v-model="dataCal.weight_gross_AS" placeholder="请输入内容" disabled>
                <template slot="append">lbs</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="净重(公制)" prop="packDataJson[0].weight">
              <el-input v-model="form.packDataJson[0].weight" placeholder="请输入内容">
                <template slot="append">kg</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="净重(美制)">
              <el-input v-model="form.packDataJson[0].weight_AS" placeholder="请输入内容">
                <template slot="append">lbs</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="40HQ装箱量" prop="packDataJson[0].hq_size">
              <el-input v-model.trim="form.packDataJson[0].hq_size" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="箱率" prop="packDataJson[0].box_rate">
              <el-input v-model.trim="form.packDataJson[0].box_rate" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="运输包装尺寸">
              <div class="sizeStyle">
                <div>
                  <el-form-item class="no-label" prop="packDataJson[0].transport_length">
                    <el-input v-model="form.packDataJson[0].transport_length" placeholder="长">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
                <div style="margin-left: 8px">
                  <el-form-item class="no-label" prop="packDataJson[0].transport_width">
                    <el-input v-model="form.packDataJson[0].transport_width" placeholder="宽">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
                <div style="margin-left: 8px">
                  <el-form-item class="no-label" prop="packDataJson[0].transport_height">
                    <el-input v-model="form.packDataJson[0].transport_height" placeholder="高">
                      <template slot="append">CM</template>
                    </el-input>
                  </el-form-item>
                </div>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="运输包装体积">
              <el-input v-model.trim="dataCal.outside_transport_volume" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计量单位" prop="packDataJson[0].unit">
              <el-select v-model.trim="form.packDataJson[0].unit" clearable placeholder="计量单位">
                <el-option v-for="(item, index) of unitList" :key="index" :label="item.dict_data_name" :value="`${item.id}`" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否支持拆单">
              <el-input v-model.trim="splitBill" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="包装类型">
              <el-select v-model.trim="form.packDataJson[0].packing_type" clearable placeholder="包装类型">
                <el-option v-for="(item, index) of packingList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否需要序列号">
              <el-select v-model.trim="form.packDataJson[0].is_serial_number" clearable placeholder="是否需要序列号">
                <el-option v-for="(item, index) of serialList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否带电">
              <el-select v-model.trim="form.packDataJson[0].is_electric" placeholder="是否带电">
                <el-option v-for="(item, index) of electricList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="打包设置">
              <el-select v-model.trim="form.packDataJson[0].pack_set" clearable placeholder="打包设置">
                <el-option v-for="(item, index) of packSetList" :key="index" :label="item.name" :value="item.code" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </template>
      <!-- <el-row v-if="form.packDataJson && form.packing_method === 2">
        <el-col :span="8">
          <el-form-item label="尺寸(公制)" :required="true">
            <div class="sizeStyle">
              <div>
                <el-form-item class="no-label" prop="packDataJson[0].length">
                  <el-input v-model="form.packDataJson[0].length" placeholder="长" disabled maxlength="10">
                    <template slot="append">CM</template>
                  </el-input>
                </el-form-item>
              </div>
              <div style="margin-left: 8px">
                <el-form-item class="no-label" prop="packDataJson[0].width">
                  <el-input v-model="form.packDataJson[0].width" placeholder="宽" disabled maxlength="10">
                    <template slot="append">CM</template>
                  </el-input>
                </el-form-item>
              </div>
              <div style="margin-left: 8px">
                <el-form-item class="no-label" prop="packDataJson[0].height">
                  <el-input v-model="form.packDataJson[0].height" placeholder="高" disabled maxlength="10">
                    <template slot="append">CM</template>
                  </el-input>
                </el-form-item>
              </div>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="体积(公制)">
            <el-input v-model.trim="form.packDataJson[0].volume" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="尺寸(美制)">
            <div class="sizeStyle">
              <div>
                <el-input v-model="form.packDataJson[0].length_AS" placeholder="长" disabled>
                  <template slot="append">IN</template>
                </el-input>
              </div>
              <div style="margin-left: 8px">
                <el-input v-model="form.packDataJson[0].width_AS" placeholder="宽" disabled>
                  <template slot="append">IN</template>
                </el-input>
              </div>
              <div style="margin-left: 8px">
                <el-input v-model="form.packDataJson[0].height_AS" placeholder="高" disabled>
                  <template slot="append">IN</template>
                </el-input>
              </div>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="体积重(美制)">
            <el-input v-model.trim="form.packDataJson[0].volume_weight_AS" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="Oversize参数">
            <el-input v-model.trim="form.packDataJson[0].oversize" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="毛重(公制)" prop="packDataJson[0].weight_gross">
            <el-input v-model="form.packDataJson[0].weight_gross" placeholder="请输入内容" disabled maxlength="10">
              <template slot="append">kg</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="毛重(美制)">
            <el-input v-model="form.packDataJson[0].weight_gross_AS" placeholder="请输入内容" disabled>
              <template slot="append">lbs</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="净重(公制)" prop="packDataJson[0].weight">
            <el-input v-model="form.packDataJson[0].weight" placeholder="请输入内容" disabled maxlength="10">
              <template slot="append">kg</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="净重(美制)">
            <el-input v-model="form.packDataJson[0].weight_AS" placeholder="请输入内容" disabled>
              <template slot="append">lbs</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="40HQ装箱量">
            <el-input v-model.trim="form.packDataJson[0].hq_size" />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="箱率">
            <el-input v-model.trim="form.packDataJson[0].box_rate">
              <template slot="append">%</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="运输包装尺寸">
            <div class="sizeStyle">
              <div>
                <el-input v-model="form.packDataJson[0].transport_length" placeholder="长">
                  <template slot="append">CM</template>
                </el-input>
              </div>
              <div style="margin-left: 8px">
                <el-input v-model="form.packDataJson[0].transport_width" placeholder="宽">
                  <template slot="append">CM</template>
                </el-input>
              </div>
              <div style="margin-left: 8px">
                <el-input v-model="form.packDataJson[0].transport_height" placeholder="高">
                  <template slot="append">CM</template>
                </el-input>
              </div>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="运输包装体积">
            <el-input v-model.trim="dataCal.outside_transport_volume" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="计量单位">
            <el-select v-model.trim="form.packDataJson[0].unit" clearable placeholder="计量单位">
              <el-option v-for="(item, index) of unitList" :key="index" :label="item.dict_data_name" :value="`${item.id}`" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否支持拆单">
            <el-input v-model.trim="splitBill" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="包装类型">
            <el-select v-model.trim="form.packDataJson[0].packing_type" clearable placeholder="包装类型">
              <el-option v-for="(item, index) of packingList" :key="index" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否需要序列号">
            <el-select v-model.trim="form.packDataJson[0].is_serial_number" clearable placeholder="是否需要序列号">
              <el-option v-for="(item, index) of serialList" :key="index" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否带电">
            <el-select v-model.trim="form.packDataJson[0].is_electric" placeholder="是否带电">
              <el-option v-for="(item, index) of electricList" :key="index" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="打包设置">
            <el-select v-model.trim="form.packDataJson[0].pack_set" clearable placeholder="打包设置">
              <el-option v-for="(item, index) of packSetList" :key="index" :label="item.name" :value="item.code" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row> -->

      <el-row>
        <mainTilte title="附件信息" />
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="商品说明书">
            <uploadFile text="支持pdf、excel、jpg、png等文件" :file-list="fileListDescription" accept-type="application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,image/jpeg,image/png" list-type="text" @handleImageSuccess="handleImageDescription" @beforeRemoveFile="beforeRemoveFileDescription" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="箱唛">
            <uploadFile text="支持pdf、excel、jpg、png等文件" :file-list="fileListmark" accept-type="application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,image/jpeg,image/png" list-type="text" @handleImageSuccess="handleImagemark" @beforeRemoveFile="beforeRemoveFilemark" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="其他资料">
            <uploadFile :file-list="fileListother" accept-type="application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" list-type="text" @handleImageSuccess="handleImageother" @beforeRemoveFile="beforeRemoveFileother" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="整箱产品组成图片">
            <uploadFile :file-list="fileListpictures" accept-type="image/jpeg,image/png" list-type="picture-card" @handleImageSuccess="handleImagepictures" @beforeRemoveFile="beforeRemoveFilepictures" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="产品包装细节图">
            <uploadFile :file-list="fileListdetail" accept-type="image/jpeg,image/png" list-type="picture-card" @handleImageSuccess="handleImagedetail" @beforeRemoveFile="beforeRemoveFiledetail" />
          </el-form-item>
        </el-col>
      </el-row>
      <div class="dialog-footer-center">
        <span>
          <el-button type="primary" :loading="btnLoading" @click="onSubmit">保存</el-button>
          <el-button @click="$router.push('/product/productManage')">取消</el-button>
        </span>
      </div>
    </el-form>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import addProductMix from '../mixins/addProduct'
import { validPrice, isNumberThanZero, validChinese, validateFirstUpperCase } from '@/utils/validate'
export default {
  mixins: [addProductMix],
  data() {
    return {
      loading: false,
      bar_code1: '', // 产品条码1
      bar_code2: '', // 产品条码2
      form: {
        type: 1, // 商品所属客户类型 0-内部员工 1-客户商品

        category_id: '', // 商品分类
        code: '', // 系统sku(自动生成)
        name_ch: '', // 中文名称
        name_en: '', // 英文名称
        operate_type: 2, // 运营类型
        bar_code_upc: '', // UPC条码
        supplier_id: '',
        purchase_id: '', // 采购员
        purchase_name: '', // 采购员名称
        bar_code: '', // 产品条码
        bar_code2: '', // 产品条码2
        company_name: '', // 所属客户名称（前端加）
        company_id: 0, // 所属客户
        purchase_price_usd: 0, // 采购价(USD) = 申报单价(USD)
        insured_price_usd: '', // 保险价值(USD)
        insured_price: '', // 是否保价
        hedge_price: '', // 保值
        packing_method: '', // 包装方式
        merge_num: '', // 可合并发货数量
        image_url: '', // 商品主图

        otherDataJson: [
          // 产品信息
          {
            id: '',
            size: '', // 尺寸
            weight: '', // 重量
            color: '', // 颜色
            material: '', // 材质
            purpose: '', // 用途
            parts: '', // 配件
            other_remark: '', // 其他备注
            pictures: '', // 整箱产品组成图片
            detail_pictures: '', // 产品包装细节图
            description: '', // 商品说明书
            box_mark: '', // 箱唛
            other: '' // 其他资料
          }
        ],

        ZH_HS: '', // 国内(HS)
        EN_HS: '', // 国外(HS)
        tax_rebate_rate: '', // 国内退税率
        tax_tariff_rate: '', // 国外关税税率

        packDataJson: [
          // 包装信息
          {
            id: '',
            length: '', // 尺寸公制(长)cm
            width: '', // 尺寸公制(宽)cm
            height: '', // 尺寸公制(高)cm
            volume: '', // 体积
            length_AS: '', // （美）尺寸公制(长)cm
            width_AS: '', // （美）尺寸公制(宽)cm
            height_AS: '', // （美）尺寸公制(高)cm
            volume_AS: '', // （美）体积
            volume_weight_AS: '', // （美）体积重 体积(美制)*系数
            oversize: '', // oversize(特大) (美制)长+（宽+高）*2
            transport_volume: '', // 运输包装尺寸(运输包装尺寸-长 *  运输包装尺寸-宽*运输包装尺寸-高 )
            unit: '', // 计量单位
            weight_gross: '', // 毛重
            weight_gross_AS: '', // （美）毛重 kg
            weight: '', // 净重 kg
            weight_AS: '', // 美制净重 kg
            hq_size: '', // 40HQ装箱量
            box_rate: '', // 箱率
            transport_length: '', // 运输包装尺寸-长
            transport_width: '', // 运输包装尺寸-宽
            transport_height: '', // 运输包装尺寸-高
            packing_type: '', // 客户商品 包装类型 0-无包装 1-自带包装 2-特殊包装
            pack_set: '', // 客户商品 打包设置 1-独立打包 0-不设置
            is_serial_number: '', // 客户商品 是否需要序列号 1-是 0-否
            is_electric: '' // 客户商品 是否带电 1-是 0-否
          }
        ],
        groupDataJson: [] // 添加商品分组
      },
      roleCodeRule: {
        // 商品分类
        category_id: [
          {
            required: true,
            message: '请选择商品分类',
            trigger: ['change', 'blur']
          }
        ],
        // 系统sku
        code: [
          { required: true, message: '请输入系统sku', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validChinese(value)
                ? callback('编码须是字母，数字，非空字符组成')
                : callback()
            },
            trigger: 'blur'
          },
          { max: 30, message: '系统sku必须在30个字符以内', trigger: 'blur' }
        ],
        // 中文名称
        name_ch: [
          { required: true, message: '请输入中文名称', trigger: 'blur' },
          { max: 50, message: '中文名称必须在50个字符以内', trigger: 'blur' }
        ],
        // 英文名称
        name_en: [
          {
            validator(rule, value, callback) {
              validChinese(value)
                ? callback(new Error('英文名称不能输入中文'))
                : callback()
            },
            trigger: 'blur'
          },
          {
            validator(rule, value, callback) {
              if (value && validateFirstUpperCase(value)) {
                callback(new Error('英文名称首字母必须大写'))
              } else {
                callback()
              }
            },
            trigger: 'blur'
          },
          { max: 50, message: '英文名称必须在50个字符以内', trigger: 'blur' }
        ],
        // 运营类型
        operate_type: [
          {
            required: true,
            message: '请选择运营类型',
            trigger: ['change', 'blur']
          }
        ],
        // UPC条码
        bar_code_upc: [
          { required: true, max: 30, message: 'UPC条码必须在30个字符以内', trigger: 'blur' }
        ],
        // 产品条码1
        bar_code: [
          { max: 30, message: '产品条码1必须在30个字符以内', trigger: 'blur' }
        ],
        // 产品条码2
        bar_code2: [
          { max: 30, message: '产品条码2必须在30个字符以内', trigger: 'blur' }
        ],
        supplier_id: [
          { required: true, message: '请选择所属供应商', trigger: 'change' }
        ],
        purchase_id: [
          { required: true, message: '请选择采购员', trigger: 'change' }
        ],
        // 所属客户
        company_id: [
          {
            required: true,
            message: '请选择商品所属客户',
            trigger: ['change', 'blur']
          }
        ],
        // 申报单价USD
        purchase_price_usd: [
          { required: true, message: '请输入申报单价(USD)', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('申报单价(USD)必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        // 保险价值USD
        insured_price_usd: [
          { required: true, message: '请输入保险价值(USD)', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('保险价值(USD)必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        // 是否保价
        insured_price: [
          {
            required: true,
            message: '请选择是否保价',
            trigger: ['change', 'blur']
          }
        ],
        // 保值
        hedge_price: [
          { required: true, message: '请输入是否保值', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('保值必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        // 包装方式
        packing_method: [
          {
            required: true,
            message: '请选择包装方式',
            trigger: ['change', 'blur']
          }
        ],
        // 合并发货数量
        merge_num: [
          { required: true, message: '请输入合并发货数量', trigger: 'blur' },
          { pattern: /^[0-9]*$/, message: '只能输入整数', trigger: 'blur' }
        ],
        // 商品主图
        image_url: [

        ],
        'otherDataJson[0].size': [
          { max: 500, message: '尺寸必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].weight': [
          { max: 500, message: '尺寸必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].color': [
          { max: 500, message: '必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].material': [
          { max: 500, message: '必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].parts': [
          { max: 500, message: '必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].other_remark': [
          { max: 500, message: '必须在500个字符以内', trigger: 'blur' }
        ],
        'otherDataJson[0].purpose': [
          { max: 500, message: '必须在500个字符以内', trigger: 'blur' }
        ],
        'packDataJson[0].length': [
          { required: true, message: '请输入长', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('长必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].width': [
          { required: true, message: '请输入宽', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('宽必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].height': [
          { required: true, message: '请输入高', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              validPrice(value)
                ? callback()
                : callback(new Error('高必须是数字且保留两位小数'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].weight_gross': [
          { required: true, message: '请输入毛重(公制)', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              isNumberThanZero(value)
                ? callback()
                : callback(new Error('必须是数字且大于0'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].weight': [
          // { required: true, message: '请输入净重(公制)', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              isNumberThanZero(value)
                ? callback()
                : callback(new Error('必须是数字且大于0'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].hq_size': [
          // { required: true, message: '请输入40HQ装箱量', trigger: 'blur' }
        ],
        'packDataJson[0].box_rate': [
          // { required: true, message: '请输入箱率', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              isNumberThanZero(value)
                ? callback()
                : callback(new Error('必须是数字且大于0'))
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].transport_length': [
          // { required: true, message: '请输入长', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              value ? validPrice(value)
                ? callback()
                : callback(new Error('长必须是数字且保留两位小数'))
                : callback()
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].transport_width': [
          // { required: true, message: '请输入宽', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              value ? validPrice(value)
                ? callback()
                : callback(new Error('宽必须是数字且保留两位小数'))
                : callback()
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].transport_height': [
          // { required: true, message: '请输入高', trigger: 'blur' },
          {
            validator(rule, value, callback) {
              value ? validPrice(value)
                ? callback()
                : callback(new Error('高必须是数字且保留两位小数'))
                : callback()
            },
            trigger: 'blur'
          }
        ],
        'packDataJson[0].unit': [
          // { required: true, message: '请选择计量单位', trigger: 'change' }
        ]
      },
      // 客户商品 包装类型 0-无包装 1-自带包装 2-特殊包装
      packingList: [
        {
          code: 0,
          name: '无包装'
        },
        {
          code: 1,
          name: '自带包装'
        },
        {
          code: 2,
          name: '特殊包装'
        }
      ],
      // 客户商品 打包设置 1-独立打包 0-不设置
      packSetList: [
        {
          code: 1,
          name: '独立打包'
        },
        {
          code: 0,
          name: '不设置'
        }
      ],
      // 客户商品 是否需要序列号 1-是 0-否
      serialList: [
        {
          code: 0,
          name: '否'
        },
        {
          code: 1,
          name: '是'
        }
      ],
      // 客户商品 是否带电 1-是 0-否
      electricList: [
        {
          code: 0,
          name: '否'
        },
        {
          code: 1,
          name: '是'
        }
      ]
    }
  },
  computed: {
    ...mapGetters(['name', 'avatar', 'roles', 'email', 'token', 'user_id']),
    // 包装信息
    dataCal() {
      const vm = this
      const {
        length,
        width,
        height,
        weight,
        weight_gross,
        transport_length,
        transport_width,
        transport_height
      } = this.form.packDataJson[0]
      const lengthConfig = vm.lengthConfig
      const weightConfig = vm.weightConfig
      const volume = vm.getVolume(length, width, height)
      const length_AS = +vm.$computed.accMul(length, lengthConfig).toFixed(6)
      const width_AS = +vm.$computed.accMul(width, lengthConfig).toFixed(6)
      const height_AS = +vm.$computed.accMul(height, lengthConfig).toFixed(6)
      const volume_AS = vm.getVolume(length_AS, width_AS, height_AS)
      const volume_weight_AS = vm.getVolumeWeight(length_AS, width_AS, height_AS)
      const oversize = +vm.getOversize(length_AS, width_AS, height_AS)
      const weight_gross_AS = +vm.$computed.accMul(weight_gross, weightConfig).toFixed(6)
      const weight_AS = +vm.$computed.accMul(weight, weightConfig).toFixed(6)
      const outside_transport_volume = vm.getVolume(transport_length, transport_width, transport_height)
      return {
        volume,
        length_AS,
        width_AS,
        height_AS,
        volume_AS,
        volume_weight_AS,
        oversize,
        weight_gross_AS,
        weight_AS,
        outside_transport_volume
      }
    },
    // 是否支持拆单
    splitBill() {
      return this.form.packing_method === 1 ? '否' : '是'
    }
  },
  created() {
    this.getUser()
    this.getProductConfig()
  },
  mounted() {
    if (this.$route.query && this.$route.query.id) {
      this.queryId = this.$route.query.id
      this.getDetailsData()
    }
  },
  methods: {
    getDetailsData() {
      const vm = this
      vm.loading = true
      vm.$http
        .get(`/product/${vm.queryId}`)
        .then((res) => {
          const { otherData, groupData, packData } = res.data
          // 基本信息
          vm.setBaseMessage(res.data)
          // 产品信息
          vm.setOtherData(otherData)
          // 设置商品分组
          vm.setGroupData(groupData)
          // 包装信息
          vm.setPackData(packData)
          vm.info = res.data
          vm.loading = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    // 设置基本信息
    setBaseMessage(data) {
      const vm = this
      const KEYS = [
        'category_id',
        'code',
        'name_ch',
        'name_en',
        'operate_type',
        'bar_code_upc',
        'bar_code',
        'bar_code2',
        'supplier_name',
        'supplier_id',
        'purchase_name',
        'purchase_id',
        'company_name',
        'company_id',
        'purchase_price_rmb',
        'purchase_price_usd',
        'insured_price',
        'insured_price_usd',
        'hedge_price',
        'packing_method',
        'merge_num',
        'ZH_HS',
        'EN_HS',
        'tax_rebate_rate',
        'tax_tariff_rate',
        'image_url'
      ]
      KEYS.forEach((e) => {
        vm.form[e] = data[e]
      })
    },
    getUser() {
      const vm = this
      const params = {
        page: 1,
        limit: 1,
        account_id: vm.user_id
      }
      vm.$http.get('/company', { params }).then((res) => {
        if (res.data.length > 0) {
          const info = res.data[0]
          vm.form.company_name = info.name
          vm.form.company_id = info.id
        }
      })
    },
    // 点击新增
    onSubmit() {
      const vm = this
      if (vm.form.packing_method === 2 && vm.form.groupDataJson.length <= 0) {
        return vm.$message.error('请选择添加至少一个商品')
      }
      if (vm.form.packing_method === 2) {
        vm.form.hedge_price = 0
      }
      vm.$refs.form.validate((valid) => {
        if (valid) {
          if (vm.form.packing_method === 2) {
            const groupSet = vm.form.groupDataJson.reduce((arr, ele) => {
              if (!arr.includes(ele.name)) {
                arr.push(ele.name)
              }
              return arr
            }, [])
            if (groupSet.length !== vm.form.groupDataJson.length) {
              return vm.$message.error('商品分组中商品名称不能重复')
            }
          }
          vm.btnLoading = true
          let params = JSON.parse(JSON.stringify(vm.form))
          delete params.company_name
          delete params.supplier_name
          params.supplier_id = 0
          params.purchase_id = 0
          if (params.groupDataJson && params.groupDataJson.length > 0) {
            // 分组
            params.groupDataJson.forEach((item) => {
              const { length, width, height, length_AS, width_AS, height_AS, hedge_price } = item
              item.volume = vm.getVolume(length, width, height)
              item.volume_AS = vm.getVolume(length_AS, width_AS, height_AS)
              item.volume_weight_AS = vm.getVolumeWeight(length_AS, width_AS, height_AS)
              item.oversize = vm.getOversize(length_AS, width_AS, height_AS)
              // if (!vm.queryId) {
              //   item.name = `${vm.category_code}${item.name}`
              // }
              if (!hedge_price) {
                item.hedge_price = 0
              }
            })

            params.groupDataJson = JSON.stringify(params.groupDataJson)
          } else {
            delete params.groupDataJson
          }
          // 包装信息
          if (vm.form.packing_method !== 2) {
            params.packDataJson[0].volume = vm.dataCal.volume
            params.packDataJson[0].length_AS = vm.dataCal.length_AS
            params.packDataJson[0].width_AS = vm.dataCal.width_AS
            params.packDataJson[0].height_AS = vm.dataCal.height_AS
            params.packDataJson[0].volume_AS = vm.dataCal.volume_AS
            params.packDataJson[0].volume_weight_AS =
              vm.dataCal.volume_weight_AS
            params.packDataJson[0].oversize = vm.dataCal.oversize
            params.packDataJson[0].weight_gross_AS = vm.dataCal.weight_gross_AS
            params.packDataJson[0].weight_AS = vm.dataCal.weight_AS
          }
          params.packDataJson[0].transport_volume = vm.dataCal.volume
          // params.bar_code = vm.bar_code1 + ',' + vm.bar_code2
          if (params.insured_price !== 1) {
            params.hedge_price = 0
          }
          params.packDataJson = [vm.coverNumberToString(params.packDataJson[0])]
          params.otherDataJson = [vm.coverNumberToString(params.otherDataJson[0])]
          params.packDataJson =
            typeof params.packDataJson === 'object'
              ? JSON.stringify(params.packDataJson)
              : params.packDataJson
          params.otherDataJson =
            typeof params.otherDataJson === 'object'
              ? JSON.stringify(params.otherDataJson)
              : params.otherDataJson
          if (+params.purchase_price_rmb) {
            params.purchase_price_usd = 0
          }
          if (+params.purchase_price_usd) {
            params.purchase_price_rmb = 0
          }
          if (vm.queryId) {
            delete params.created_at
            delete params.updated_at
            params = this.coverNumberToString(params)
            vm.$http
              .put(`/product/${vm.queryId}`, params)
              .then((res) => {
                if (res.code === 10000) {
                  vm.$message.success('修改成功')
                  vm.$router.push('/product/productManage')
                }
                vm.btnLoading = false
              })
              .catch(() => {
                vm.btnLoading = false
              })
          } else {
            params = this.coverNumberToString(params)
            vm.$http
              .post(`/product`, params)
              .then((res) => {
                if (res.code === 10000) {
                  vm.$message.success('新增成功')
                  vm.$router.push('/product/productManage')
                }
                vm.btnLoading = false
              })
              .catch((err) => {
                console.log(err)
                vm.btnLoading = false
              })
          }
        }
      })
    }
  }
}
</script>

<style scoped>
.addExpense {
  padding: 15px;
  background: #fff;
}
/deep/.el-select,
.el-autocomplete,
.el-cascader {
  width: 100%;
}
.sizeStyle {
  display: flex;
}
.sizeStyle /deep/ .el-input__inner {
  border-right: 0;
}
.sizeStyle /deep/ .el-input-group__append {
  padding-left: 4px;
  padding-right: 4px;
  font-size: 14px;
  color: #333333;
  background: #fff;
}
.avatar-uploader /deep/ .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader /deep/ .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 120px;
  height: 120px;
  line-height: 120px;
  text-align: center;
}
.avatar {
  width: 120px;
  height: 120px;
  display: block;
}
</style>
